<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>MoroccoBy</title>
        <h:outputStylesheet name="css/jsfcrud.css"/>
        <link href="styles/styles.css" type="text/css" rel="stylesheet"></link>
    </h:head>
    <h:body>

        <ui:include src="head.xhtml"></ui:include>

        <div class="main_container">
            <div id="main_content"> 

                <div class="crumb_navigation">
                    Navigation: <span class="current">Home</span>

                </div>        

                <div class="left_content">

                    <div class="title_box">Categories</div>

                    <ul class="left_menu">
                        <h:form>
                            <c:forEach items="#{homeMB.list}" var="item" varStatus="status">
                                <li class="even">
                                    <h:commandLink  action="#{homeMB.getProduits}" value="#{item.libelle}">
                                        <f:param name="idCategorie" value="#{item.id}" />
                                    </h:commandLink>
                                </li>
                            </c:forEach>
                        </h:form>
                    </ul> 

                    <div class="title_box">Special Products</div>  
                    <div class="border_box">
                        <div class="product_title"><a href="details.html">Motorola 156 MX-VL</a></div>
                        <div class="product_img"><a href="details.html"><img src="images/laptop.png" alt="" title="" border="0" /></a></div>
                        <div class="prod_price"><span class="reduce">350$</span> <span class="price">270$</span></div>
                    </div>  


                    <div class="title_box">Newsletter</div>  
                    <div class="border_box">
                        <input type="text" name="newsletter" class="newsletter_input" value="your email"/>
                        <a href="#" class="join">join</a>
                    </div>  

                    <div class="banner_adds">

                        <a href="#"><img src="images/bann2.jpg" alt="" title="" border="0" /></a>
                    </div>    


                </div><!-- end of left content -->


                <div class="center_content">
                    <div class="center_title_bar">Contactez nous .</div>


                    <li id="listproduits_li">
                        <c:forEach items="#{homeMB.listProd}" varStatus="status" var="item">
                            <table border="0" style="width: 500px;" >
                                <tr>
                                    <td rowspan="3">
                                        <img src="Images-Produits/${item.images[0].image}" width="${item.images[0].largeur}" height="${item.images[0].longueur}" />
                                    </td>
                                    <td width="350px">
                                        <span class="lib"> 
                                            ${item.libelle}
                                        </span>
                                        <br />
                                    </td>
                                    <td rowspan="3">
                                        <span class="pu"> ${item.prix} DH </span>
                                        <h:form>
                                            <h:commandLink id="addCart" class="addtocart" action="#{panierBean.add}"  value="Ajouter au panier" >
                                                <f:param name="idProd"  value="#{item.id}" />
                                                <f:param name="qte" value="1" />
                                                <f:ajax render=":panFormAff" execute="addCart" />
                                            </h:commandLink>
                                        </h:form>
                                        <br></br>
                                        <a href="#">Details</a>
                                    </td>  
                                </tr>
                                <tr> 
                                    <td>
                                        ${item.description}
                                        <br />
                                    </td>
                                </tr>
                                <tr><td>

                                        pièces disponibles 
                                        <br> 
                                        </br>
                                    </td>
                                </tr>
                            </table>
                        </c:forEach>
                    </li>


                    <div class="center_title_bar">Recommended Products</div>

             

                </div><!-- end of center content -->

                <div class="right_content">

                    <div class="title_box">Connexion</div>

                    <div id="login">

                        <h:form rendered="#{sessionScope['UserLogged'] eq null}">
                            <h:inputText id="email" value="#{authentificationBean.email}" ></h:inputText><br/>
                            <h:inputSecret id="password" value="#{authentificationBean.password}" ></h:inputSecret>
                            <p class="remember_me">
                                <label>
                                    <a href="#" >Mot de passe oublié ?</a>
                                </label>
                            </p>
                            <p class="submit"> <h:commandButton type="submit" action="#{authentificationBean.login}" value="Login"></h:commandButton></p>
                        </h:form>

                        <h:form rendered="#{sessionScope['UserLogged'] ne null}">
                            Bienvenue  #{sessionScope['UserLogged'].compte.pseudo}
                            <h:commandLink action="#{authentificationBean.logout}" value="Deconnexion"></h:commandLink>
                        </h:form>

                    </div>


                    <div class="title_box">What’s new</div>  

                    <ul class="left_menu">
                        <li class="odd"><a href="services.html">Sony</a></li>
                        <li class="even"><a href="services.html">Samsung</a></li>
                        <li class="odd"><a href="services.html">Daewoo</a></li>
                        <li class="even"><a href="services.html">LG</a></li>
                        <li class="odd"><a href="services.html">Fujitsu Siemens</a></li>
                        <li class="even"><a href="services.html">Motorola</a></li>
                        <li class="odd"><a href="services.html">Phillips</a></li>
                        <li class="even"><a href="services.html">Beko</a></li>
                    </ul>      

                    <div class="banner_adds">

                        <a href="#"><img src="images/bann1.jpg" alt="" title="" border="0" /></a>
                    </div>        

                </div><!-- end of right content -->   


            </div><!-- end of main content -->

        </div>
        <ui:include src="footer.xhtml"></ui:include>
    </h:body>

</html>

